<import from="./integrated-main-menu/integrated-main-menu"></import>

<div class="logo titlebar-icon">
    <img src="logo/circle/32x32.png" alt="logo"/>
</div>

<integrated-main-menu></integrated-main-menu>

<div class="title" data-tauri-drag-region>
    ${title}
</div>

<div class="actions">
    <i class="app-update-icon action-icon text-blue"
       click.trigger="openAppUpdateDialog()"
       title="Update available"
       if.bind="appService.appHasUpdate"></i>
    <i class="window-always-on-top-icon action-icon ${windowState.isAlwaysOnTop ? 'text-blue' : ''}"
       shells="!browser"
       click.trigger="toggleWindowAlwaysOnTop()"
       title="${windowState.isAlwaysOnTop ? 'Disable' : 'Enable'} Always on Top"></i>
    <i class="settings-icon action-icon"
       click.trigger="openSettingsWindow()"
       title="${shortcutManager.getShortcutByName('Settings').toString()}"></i>
</div>

<div class="window-controls ${leftWinCtrls ? 'order-first' : ''}" shells="!browser">
    <i class="window-minimize-icon action-icon ${leftWinCtrls ? 'order-last' : ''}"
       click.trigger="minimize()"
       title="Minimize"></i>
    <i class="${windowState.isMaximized ? 'window-restore-icon' : 'window-maximize-icon'} action-icon"
       click.trigger="maximize()"
       title="${windowState.isMaximized ? 'Restore' : 'Maximize'}"></i>
    <i class="window-close-icon action-icon hover-bg-red ${leftWinCtrls ? 'order-first' : ''}"
       click.trigger="close()"
       title="Close"></i>
</div>
